<template>
	<div>
		<el-button primary @click="grant()"> 授权</el-button>
		<el-table :data="tableData" border style="width: 100%" size="mini"
		 
		 @selection-change="handleSelectionChange" >
			
			<el-table-column type="selection" label="选择" width="200"> </el-table-column>
			<el-table-column type="index" label="序号" width="200"> </el-table-column>
			<el-table-column prop="roleName" label="角色名称"> </el-table-column>
		</el-table>
		
		
	</div>
</template>

<script>
	//
	export default {
		name:'GrantRole',
		data(){
			return {
				tableData:[],
				searchForm: {
					current:1,
					size:999
				},
				roleIds:[]
			}
		},
		methods:{
			list() {
				let url = '/api/role/page';
				this.http.get(url, (page) => {
					this.tableData = page.records;
				}, this.searchForm)
			},
			grant(){
				//将当前用户id、选择的角色id，保存
				// 
				console.log("this.roleIds",this.roleIds)
				console.log("this.$route.query.userId",this.$route.query.userId);
				//如果角色id一个都没选，提示
				if(this.roleIds.length<=0){
					  this.$message({
					          message: '请至少选择一个角色进行授权',
					          type: 'warning'
					        });
					return ;
				}
				
				this.http.post('/api/user/grant',(success)=>{
					alert("success:"+success)
					if(success){
						this.$message({
						        message: '授权成功',
						        type: 'success'
						      });
					}else{
						this.$message({
						        message: '授权失败',
						        type: 'error'
						      });
					}
				},{
					userId:this.$route.query.userId,
					roleIds:this.roleIds
				})
				
				
				
				
			},
			handleSelectionChange(selectedRow) {
				// let roleIds = [];
				this.roleIds = [];
				if(selectedRow.length>0){
					selectedRow.forEach((role,index)=>{
						this.roleIds.push(role.roleId);
					})
				}

				
		  }
			
		},
		created() {
			this.list();
			// console.log("this.$route.query.userId",this.$route.query.userId)
			
			
		}
	}
	
</script>

<style>
</style>
